<template>
	<view class="flex-center1" style="height: 100vh">
		<view>
			<view class="flex-center1" style="margin-bottom: 20rpx">
				<image src="@/static/login/back1.png" style="width: 574rpx; height: 436rpx"></image>
			</view>
			<!-- <view class="flex-center1" style="font-weight: 400; margin-bottom: 20rpx; margin-bottom: 50rpx; font-size: 28rpx; color: #999999">中国移动认证</view>
			<view class="flex-center1" style="font-weight: 600; font-size: 40rpx; margin-bottom: 50rpx; color: #333333">138****2551</view> -->
			<view class="flex-center1" style="margin-bottom: 30rpx">
				<!-- <view
					@click="handleThirdLoginApp"
					class="flex-center1"
					style="width: 640rpx; height: 96rpx; background: #1365f9; border-radius: 48rpx; font-weight: 600; font-size: 32rpx; color: #ffffff"
				>
					本机号码一键登录
				</view> -->
				<!-- <button class="flex-center1" type="default" open-type="getPhoneNumber"
					@getphonenumber="decryptPhoneNumber"
					style="width: 640rpx; height: 96rpx; background: #1365f9; border-radius: 48rpx; font-weight: 600; font-size: 32rpx; color: #ffffff">
					本机号码一键登录
				</button> -->
				<button class="flex-center1" type="default" @click="shouQuanLogin"
					style="width: 640rpx; height: 96rpx; background: #1365f9; border-radius: 48rpx; font-weight: 600; font-size: 32rpx; color: #ffffff">
					授权登录
				</button>
			</view>
			<view @click="$tools.navigite('./logincode')" class="flex-center1"
				style="font-weight: 400; font-size: 28rpx; color: #333333; margin-bottom: 50rpx">
				已有账号登录
			</view>

			<view class="align-center">
				<u-checkbox-group v-model="checkboxValue" placement="column" @change="checkboxChange">
					<u-checkbox shape="circle" size="35" name="1"></u-checkbox>
				</u-checkbox-group>
				<view>
					<text style="font-weight: 400; font-size: 24rpx; color: #aaaaaa">我已阅读并同意</text>
					<text style="font-weight: 400; font-size: 24rpx; color: #1365f9">《一键登录服务协议》和《隐私政策》</text>
				</view>

			</view>
			<view class="qxdl" @click="quXiaoDengLu">
				<view type="default" class="qxdlbutton">取消登录</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				checkboxValue: [],
				checked: false
			};
		},
		methods: {
			quXiaoDengLu() {
				console.log('取消登录')
				uni.redirectTo({
					url: '/pages/index/index'
				})
			},
			checkboxChange(n) {
				if (n.length > 0) {
					this.checked = true;
				} else {
					this.checked = false;
				}
			},
			requestPhoneAuth() {
				uni.getSetting({
					success: (settingRes) => {
						if (!settingRes.authSetting['scope.userInfo']) {
							uni.showModal({
								title: '提示',
								content: '需要获取您的授权才能继续',
								showCancel: false,
								confirmText: '去授权',
								success: () => {
									uni.openSetting();
								}
							});
						} else {
							// this.getPhoneNumber();
						}
					}
				});
			},
			// 微信授权登录
			shouQuanLogin(e) {
				// if (!e.detail.code) {
				// 	this.$tools.navigiteTo('/pages/index/index');
				// }
				// if (e.detail.code) {
				if (!this.checked) return this.$tools.toast('请阅读并勾选一键登录协议和隐私政策');
				const that = this;
				uni.login({
					provider: 'weixin',
					onlyAuthorize: true,
					success: function(event) {
						const {
							code
						} = event;
						//客户端成功获取授权临时票据（code）,向业务服务器发起登录请求。
						const data = {
							phoneCode: e.detail.code,
							code: code
						};
						console.log("授权成功", data)
						that.$request('front/keyLogin', data).then((res) => {
							console.log('登录成功返回值', res);
							if (res.code == 0) {
								that.$tools.toast('登录成功');
								uni.setStorageSync('token', res.obj);
								that.$store.commit('login', true);
								that.$request('front/user/getRole').then((res1) => {
									console.log('获取角色', res1)
									if (res1.obj === -1) {
										that.$tools.navigiteTo('/pages/mine/mine');
									}
									if (res1.obj === 0) {
										that.$tools.navigiteTo('/pages1/index/index');
									}
									if (res1.obj === 1) {
										that.$tools.navigiteTo('/pages2/index/index');
									}
								});
							} else {
								that.$tools.toast('登录失败');
							}
						});
					},
					fail: function(err) {
						console.log(err, 'err');
						// 登录授权失败
						// err.code是错误码
					}
				});
				// }
			},
			// 手机号授权登录
			decryptPhoneNumber(e) {
				if (!e.detail.code) {
					this.$tools.navigiteTo('/pages/index/index');
				}
				if (e.detail.code) {
					if (!this.checked) return this.$tools.toast('请阅读并勾选一键登录协议和隐私政策');
					const that = this;
					uni.login({
						provider: 'weixin',
						onlyAuthorize: true,
						success: function(event) {
							const {
								code
							} = event;
							console.log(code, '111');
							//客户端成功获取授权临时票据（code）,向业务服务器发起登录请求。
							const data = {
								phoneCode: e.detail.code,
								code: code
							};
							that.$request('front/keyLogin', data).then((res) => {
								console.log(res, 'res');
								if (res.code == 0) {
									that.$tools.toast('登录成功');
									uni.setStorageSync('token', res.obj);
									that.$store.commit('login', true);
									that.$request('front/user/getRole').then((res1) => {
										if (res1.obj === -1) {
											that.$tools.navigiteTo('/pages/index/index');
										}
										if (res1.obj === 0) {
											that.$tools.navigiteTo('/pages1/index/index');
										}
										if (res1.obj === 1) {
											that.$tools.navigiteTo('/pages2/index/index');
										}
									});
								} else {
									that.$tools.toast('登录失败');
								}
							});
						},
						fail: function(err) {
							console.log(err, 'err');
							// 登录授权失败
							// err.code是错误码
						}
					});
				}
			}
		}
	};
</script>

<style>
	.qxdl {
		margin-top: 40rpx;
		display: flex;
		justify-content: center;
	}

	.qxdlbutton {
		background-color: #fff;
		border: none;
	}
</style>